window.onload = function () {
  setInterval("data()", 1000);
  //获取两个按钮
  var prev = document.getElementById("prev");
  var next = document.getElementById("next");

  //获取页面中的img标签
  var img = document.getElementsByClassName("imm");

  //获取pointer
  var pointer = document.getElementById("pointer");

  //获取outer
  var outer = document.getElementById("outer");

  //获取imglist
  var imglist = document.getElementById("imglist");
  imglist.style.width = 968 * img.length + "px";

  //设置pointer的left值
  pointer.style.left = (outer.offsetWidth - pointer.offsetWidth) / 2 + "px";

  //默认显示图片的索引
  var index = 0;
  //获取所有的a
  var allA = document.getElementsByClassName("active");
  //设置默认选中效果
  allA[index].style.backgroundColor = "white";
  //创建一个数组，用来保存图片的路径
  var imgArr = [
    "./img/banner5.jpg",
    "./img/banner.jpg",
    "./img/banner1.jpg",
    "./img/banner2.jpg",
    "./img/banner3.jpg",
    "./img/banner4.jpg",
    "./img/banner6.jpg",
    "./img/banner7.jpg",
    "./img/banner5.jpg",
  ];

  //分别为两个按钮绑定单击响应函数
  prev.onclick = function () {
    //关闭自动切换的定时器
    clearInterval(timer);

    //切换到上一张，索引自减
    index--;

    if (index < 0) {
      index = imgArr.length - 1;
    }

    //上一张
    img.src = imgArr[index];

    setA();

    //使用move函数来切换图片
    move(imglist, "left", -968 * index, 40, function () {
      //动画执行完毕，开启自动切换
      autoChange();
    });
  };

  next.onclick = function () {
    //关闭自动切换的定时器
    clearInterval(timer);

    //切换到下一张，索引自增
    index++;

    if (index > imgArr.length - 1) {
      index = 0;
    }

    //下一张
    img.src = imgArr[index];

    setA();

    //使用move函数来切换图片
    move(imglist, "left", -968 * index, 40, function () {
      //动画执行完毕，开启自动切换
      autoChange();
    });
  };

  //为所有超链接都绑定单击响应函数
  for (var i = 0; i < allA.length; i++) {
    //为每一个超链接都添加一个num属性
    allA[i].num = i;

    //为超链接绑定单击响应函数
    allA[i].onclick = function () {
      //关闭自动切换的定时器
      clearInterval(timer);

      //获取点击超链接的索引，将其设为index
      index = this.num;

      //切换图片
      imglist.style.left = -968 * index + "px";

      //设置选中的a
      setA();

      //使用move函数来切换图片
      move(imglist, "left", -968 * index, 40, function () {
        //动画执行完毕，开启自动切换
        autoChange();
      });
    };
  }

  //开启自动切换图片
  autoChange();

  //创建一个方法用来设置选中的a
  function setA() {
    //判断当前索引是否为最后一张图片
    if (index >= imgArr.length - 1) {
      index = 0;
      imglist.style.left = 0;
    }

    //遍历所有的a
    for (var i = 0; i < allA.length; i++) {
      //空串：去除内联样式
      allA[i].style.backgroundColor = "";
    }

    //将选中的a设置为黑色
    allA[index].style.backgroundColor = "orange";
  }

  //定义一个自动切换的标识
  var timer;
  //创建一个函数，用来开启自动切换图片
  function autoChange() {
    //开启一个定时器，用来定时去切换图片
    timer = setInterval(function () {
      //使索引自增
      index++;

      //判断index的值
      index %= imgArr.length;

      //执行动画，切换图片
      move(imglist, "left", -968 * index, 40, function () {
        //修改导航按钮
        setA();
      });
    }, 3000);
  }
};
function data() {
  var s2 = "2022-12-13";
  s1 = new Date();
  s2 = new Date(s2.replace(/-/g, "/"));
  var day = s2.getTime() - s1.getTime();
  var d = parseInt(day / (1000 * 60 * 60 * 24));
  var h = parseInt((day / (1000 * 60 * 60)) % 60);
  var m = parseInt((day / (1000 * 60)) % 60);
  var s = parseInt((day / 1000) % 60);
  document.getElementById("time").innerHTML =
    d + "天" + h + "时" + m + "分" + s + "秒";
}
